<template>
  <div class="main flex-v">
    <div class="ioutWrap">
      <div class="balanceTop">
        <div style="position: relative;z-index: 3;">
          <!-- <go-back aa="../volunteer/indexs"></go-back> -->
          <headerBack></headerBack>
        </div>
        <div class="topHeadTitle">
          <div class="banTitle">{{fromurl==='indexs'?'志愿填报':'您的专属方案已生成'}}</div>
          <div class="watchNotes" @click="watchNotes">查看说明</div>
        </div>

        <!-- <img class="topBg" src="~/static/images/volunteer_pic_bg.png" alt=""> -->
      </div>
      <div class="programmeWrap">
        <scroller ref="scrollerBottom" style="top: 2.6rem;">
          <div class="programmeBox">
            <!-- <div class="proSmBox flex-h" @click="gotos('1')">
              <div class="left flex1">
                <span class="lefttxt1 l1">综合平衡策略</span>
                <span class="lefttxt2">平衡考虑院校因素与专业因素，综合考察学科实力与专业匹配度</span>
              </div>
              <div class="right">
                <img src="~/static/images/vol1.png" alt />
              </div>
            </div> -->
            <div class="proSmBox flex-h" @click="gotos('2')">
              <div class="left flex1">
                <span class="lefttxt1 l2">院校优先策略</span>
                <span class="lefttxt2">优先考虑院校因素，综合考察院校实力、院校地域、院校历史录取情况</span>
              </div>
              <div class="right">
                <img src="~/static/images/vol2.png" alt />
              </div>
            </div>
            <div class="proSmBox flex-h" @click="gotos('3')">
              <div class="left flex1">
                <span class="lefttxt1 l3">专业优先策略</span>
                <span class="lefttxt2">优先考虑专业匹配度，综合考察院校因素与专业因素</span>
              </div>
              <div class="right">
                <img src="~/static/images/vol3.png" alt />
              </div>
            </div>
            <div class="proBotter flex-h">
              <div class="lefts flex1" @click="commonJs.gopush('../evaluation/ad')">
                <span class="tex1">生涯测评</span>
                <span class="tex2">填报方案更精准</span>
              </div>
              <div class="lefts flex1" @click="goArtificial">
                <span class="tex1">人工服务</span>
                <span class="tex2">一对一定制方案</span>
              </div>
              <!-- 	<div class="rights flex1 rightCareer" @click="goCareer" style="margin-right: 0;">
								<span class="tex1">院校数据</span>
								<span class="tex2">即刻查询院校数据</span>

              </div>-->
            </div>
            <div style="width: 7.5rem;height: 3.5rem;"></div>
          </div>
        </scroller>
      </div>
    </div>
  </div>
</template>

<script>
import headerBack from "~/components/headerBack";
import ls from "store2";
export default {
  head: {},
  components: {
    headerBack
  },
  data() {
    return {
      fromurl: "",
      couponNum: 0
    };
  },
  // created() {
  //   this.commonJs.gologins();
  //   this.fromurl = ls.get("preUrl");
  //   if (this.commonJs.GetUrlParam("pay_status") == "success") {
  //     this.$vux.toast.text("支付成功");
  //   } else if (this.commonJs.GetUrlParam("pay_status") == "failed") {
  //     this.$vux.toast.text("支付失败，请重新支付");
  //   }
  // },
  methods: {
    goCareer() {
      let yxkData = ls.get("yxkData");
      let ure = window.location.href;
      let urls = encodeURIComponent(ure);
      let transData = {
        userArea: encodeURIComponent(ls.get("userArea")),
        userId: yxkData.userId,
        userVoId: yxkData.userVoId,
        accessToken: yxkData.accessToken,
        userType: yxkData.userType
      };
      // process.env.workUrl/h5-stu-wx/#/volunteer/indexs

      window.location.replace(
        process.env.workUrl +
          "/wx-yxk/#/univCareer" +
          "?vol_return_url=" +
          urls +
          "&volData=" +
          encodeURIComponent(JSON.stringify(transData))
      );
      // window.location.replace("http://192.168.8.202:8800/wx-yxk/#/univCareer?yxkData="+encodeURIComponent(JSON.stringify(yxkData)))
    },

    goArtificial() {
      let url = encodeURIComponent(
        process.env.workUrl + "/h5-stu-wx/#/volunteer/programme"
      );
      this.commonJs.checkCodeVip("dr", url, process.env.mallDrId);
    },
    // programme


    watchNotes() {
      this.commonJs.gopush("notes", 1);
    },

    gotos(tys) {
      this.$vux.loading.show();
      ls.set("preUrl", "../volunteer/programme");
      this.$store.commit("changeUrl", "../volunteer/programme");
      this.commonJs.gopush("balance", tys);
  
    }
  },
  mounted: function() {
    this.$vux.loading.hide();
  }
};
</script>

<style scoped lang="less">
.ioutWrap {
  width: 100%;
  min-height: 100vh;

  background: #fff;

  .balanceTop {
    // z-index: 2;
    width: 100%;
    height: 2.6rem;
    background: #fff url("~/static/images/volunteer_pic_bg.png") no-repeat;
    background-size: 100% 100%;

    .topHeadTitle {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 0.44rem;
      margin-left: 0.3rem;
      margin-right: 0.31rem;

      .banTitle {
        display: block;
        font-size: 0.5rem;
        font-weight: bold;
        color: rgba(34, 34, 34, 1);
        line-height: 0.44rem;
        display: block;
      }

      .watchNotes {
        color: #222;
        font-size: 0.26rem;
        line-height: 0.44rem;
      }
    }
  }
}

.programmeWrap {
  width: 7.5rem;
  min-height: 100vh;
  height: auto;

  .programmeBox {
    width: 100%;
    height: 15rem;
    padding: 0.1rem 0.3rem 0.3rem;
    box-sizing: border-box;

    .textTitle {
      font-size: 0.5rem;
      font-weight: bold;
      color: rgba(34, 34, 34, 1);
      line-height: 0.8rem;
      display: block;
      margin-bottom: 0.6rem;
    }

    .proSmBox {
      margin-bottom: 0.2rem;
      width: 100%;
      height: 2.4rem;

      box-shadow: 0px 0px 0.2rem 0px rgba(204, 204, 204, 0.3);
      border-radius: 0.1rem;

      .left {
        padding-left: 0.3rem;
        box-sizing: border-box;

        .lefttxt1 {
          font-size: 0.4rem;

          font-weight: bold;

          line-height: 0.6rem;
          display: block;
        }

        .l1 {
          color: rgba(148, 210, 103, 1);
        }

        .l2 {
          color: rgba(254, 192, 62, 1);
        }

        .l3 {
          color: rgba(90, 178, 241, 1);
        }

        .lefttxt2 {
          display: block;
          height: auto;
          font-size: 0.24rem;

          font-weight: 500;
          color: rgba(153, 153, 153, 1);
          line-height: 0.4rem;
        }
      }

      .right {
        width: 2.43rem;
        height: 2.4rem;

        img {
          display: block;
          width: 100%;
          height: 2.4rem;
        }
      }
    }

    .proBotter {
      width: 100%;
      height: auto;
      margin-top:1rem;
      .lefts,
      .rights {
        width: 100%;
        min-height: 1.1rem;
        height: auto;
        padding: 0.2rem;
        box-sizing: border-box;

        background: rgba(255, 255, 255, 1);
        border-radius: 0.08rem;
        color: @mainColor;
        border: 0.02rem solid rgba(238, 238, 238, 1);

        .tex1 {
          display: block;
          height: 0.5rem;
          font-size: 0.3rem;
          font-weight: bold;
          color: @mainColor;
          line-height: 0.5rem;
        }

        .tex2 {
          display: block;
          height: 0.37rem;
          font-size: 0.2rem;

          font-weight: 400;
          color: rgba(153, 153, 153, 1);
          line-height: 0.37rem;
        }
      }

      .lefts {
        margin-right: 0.1rem;
        background: url("~/static/images/volunteer_pic_career.png") no-repeat;
        background-size: 100% 100%;
      }

      .rights {
        margin-right: 0.1rem;
        background: url("~/static/images/volunteer_pic_consult.png") no-repeat;
        background-size: 100% 100%;
      }
      .rightCareer {
        background: url("~/static/images/volunteer_pic_school.png") no-repeat;
        background-size: 100% 100%;
      }
      .spBtn {
        display: block;
        width: 3.35rem;
        height: 0.9rem;
        border-radius: 0.1rem;
        text-align: center;
        border: 0.02rem solid rgba(238, 238, 238, 1);
        font-size: 0.36rem;
        font-weight: bold;
        color: rgba(153, 153, 153, 1);
        line-height: 0.9rem;
        margin: 0.2rem auto;
      }
    }
  }
}
</style>
